<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body {
            margin: 0;
            padding: 0;
        }

        #canvas {}
    </style>
</head>

<body>
    <canvas id="canvas"></canvas>
</body>

<!-- 顶点着色器 -->
<script id="vertexShader" type="x-shader/x-vertex">
    attribute vec4 a_Position;
    attribute float a_PointSize;
    uniform vec4 u_translation;
    uniform float u_sinB;
    uniform float u_cosB;
    uniform float u_scale;
    uniform mat2 u_m2;
    void main(){
        gl_Position.x = (a_Position.x * u_cosB - a_Position.y * u_sinB  + u_translation.x) * u_scale;
        gl_Position.y = (a_Position.y * u_cosB + a_Position.x * u_sinB  + u_translation.y) * u_scale;
        gl_Position.z = (a_Position.z) * u_scale;
        gl_Position.w = 1.0;

        gl_PointSize = a_PointSize;
    }
</script>
<!-- 片元着色器 -->
<!-- 注意:第一行的精度一定要加 -->
<script id="fragmentShader" type="x-shader/x-fragment">
    precision mediump float;
    uniform vec4 u_FragColor;
    void main(){
        gl_FragColor = u_FragColor;
    }
</script>



<script type="module" src="../jsDemo/Demo081-图形的PRS.js"></script>
<script>

</script>

</html>